<template>
	<section>	
		<el-col :span="24" v-if="$store.state.role=='teacher'">
			<el-breadcrumb separator=">">
			  <el-breadcrumb-item :to="{path:'/courseachievement?id='+$route.query.id }">课程成绩</el-breadcrumb-item>
			  <el-breadcrumb-item >{{realName}}</el-breadcrumb-item>
			</el-breadcrumb>			
		</el-col>		
		<el-row>
			<h1 style="font-size: 24px;padding-left: 100px;font-weight: normal;">{{realName}}</h1>
			<h1 style="font-size: 24px;padding-left: 100px;font-weight: normal;">课程总成绩：<span style="color: #F00000;" v-if="!ListInfo.isPublished&&$store.state.role=='student'">成绩未发布</span><span style="color: #F00000;" v-if="ListInfo.isPublished||$store.state.role=='teacher'">{{totalScore}}分</span></h1>		
			<el-col :span="20" :offset="2" v-if="ListInfo.isPublished||$store.state.role=='teacher'">
				<table style="width: 100%;">
					<tr>
						<th  colspan="2">课程成绩构成</th>
						<th>得分</th>
						<th>平均分</th>
						<th>权重</th>
					</tr>
					<tr>
						<td  v-bind:rowspan="List.length">个人作业</td>	
						<td>{{List[0].stageUnit.name}}</td>
						<td>{{List[0].unitScore}}</td>		
						<td v-bind:rowspan="List.length">{{pingscore}}</td>	
						<td v-bind:rowspan="List.length">{{quanzhonglist[0].value}}%</td>	
					</tr>			
					<tr v-for="(el,$index) in List" v-if="$index>0">
						<td>{{el.stageUnit.name}}</td>
						<td>{{el.unitScore}}</td>
					</tr>	
					<tr>
						<td rowspan="2">小组作业</td>	
						<td>沙盘推演</td>
						<td><p v-if="ListInfo.courseTeam">{{ListInfo.courseTeam.inferScore}}</p></td>		
						<td rowspan="2">{{teampingscore}}</td>	
						<td rowspan="2">{{quanzhonglist[1].value}}%</td>	
					</tr>	
					<tr>
						<td>项目路演</td>
						<td><p v-if="ListInfo.courseTeam">{{ListInfo.courseTeam.roadScore}}</p></td>		
					</tr>
					<tr>
						<td >课程进度</td>	
						<td>课程进度</td>
						<td>{{completionScore}}</td>		
						<td>{{completionScore}}</td>	
						<td>{{quanzhonglist[2].value}}%</td>	
					</tr>	
					<tr>
						<td >课堂表现</td>	
						<td>课堂表现</td>
						<td>{{performenceScore}}</td>		
						<td>{{performenceScore}}</td>	
						<td>{{quanzhonglist[3].value}}%</td>	
					</tr>						
				</table>				
			</el-col>				
				
		</el-row>

	</section>
</template>
<script>
	import { courseStudent,courseTeam,courseone,coursestudentmark,courseStucontent} from '../../api/api';
	import echarts from 'echarts'
	export default {
		data() {
			return {
				coursebase:{
					Score:[],
					name:[],
				},
				realName:"",
				totalScore:"",
				InferScore:[],
				OtherScore:[],
				ListInfo:{
					
				},
				pingscore:"",
				teampingscore:"",
				performenceScore:"",
				completionScore:"",
				List:[],
				quanzhonglist:[
	                {value:'', name:'个人成绩'},
	                {value:'', name:'小组成绩'},
	                {value:'', name:'课堂表现'},
	                {value:'', name:'课程进度'},
	               
	            ],
			}
		},	
		methods: {	
			//页面跳转
		    skip(link,id,row){
		        this.$router.push(
		        	{
		        		path:link,
		        		query:{
		        			id:id,
		        		}
		        	}
		        )
		        sessionStorage.setItem("course",JSON.stringify(row))
		    },	
			handleCurrentChange(val) {
				this.page = val;
				this.getList();
			},	
			//获取项目列表
			getList: function (type) {
				var _this=this;
				var userId="";
				if(this.$route.query.userid){
					userId=this.$route.query.userid
				}else{
					userId=localStorage.getItem('userId')
				}
				var params={courseId:this.$route.query.id,userId:userId,pageSize:2000}
				//NProgress.start();
				courseStucontent(params).then((res) => {
					this.List=res.list;
					var pingscore="";
					$.each(res.list,function(e,value){
						pingscore=parseInt(pingscore+value.unitScore)
					})
					this.pingscore=pingscore/res.list.length
				});					
				courseStudent(params).then((res) => {
					this.ListInfo = res.list[0];
					this.realName=res.list[0].user.realName;
					this.InferScore.push(this.ListInfo.courseTeam.inferScore);
					this.InferScore.push(this.ListInfo.courseTeam.roadScore);
					this.teampingscore=parseFloat((this.ListInfo.courseTeam.inferScore+this.ListInfo.courseTeam.roadScore)/2)
					if(this.$store.state.role=='student'){
						this.totalScore=res.list[0].totalScore;
						this.performenceScore=res.list[0].performenceScore;
						this.completionScore=res.list[0].completionScore;						
					}					
				});					
			},
			getcourseInfo:function(){
				var params=this.$route.query.id;
				var _this=this;
				courseone(params).then((res)=>{			
					_this.quanzhonglist[0].value=res.personWeight;
					_this.quanzhonglist[1].value=res.teamWeight;
					_this.quanzhonglist[2].value=res.performanceWeight;
					_this.quanzhonglist[3].value=res.completionWeight;
					
					_this.performanceWeight=res.performanceWeight/100;
					_this.personWeight=res.personWeight/100;
					_this.teamWeight=res.teamWeight/100;
					_this.completionWeight=res.completionWeight/100;

				})			
			},						
		},	
		mounted() {
			this.getList();
			this.getcourseInfo();
			if(this.$store.state.role=='teacher'){
				this.performenceScore=JSON.parse(localStorage.getItem('studentdetail')).performenceScore;
				this.completionScore=JSON.parse(localStorage.getItem('studentdetail')).completionScore;
				this.totalScore=JSON.parse(localStorage.getItem('studentdetail')).totalScore				
			}

		}
	};

</script>
<style scoped>
	table, th , td  {
  border: 1px solid grey;
  border-collapse: collapse;
  padding:10px;
}
table tr:nth-child(odd) {
  background-color: #f1f1f1;
}
table tr:nth-child(even) {
  background-color: #ffffff;
}
</style>